<template>
	<div v-if="orderList">
		<uni-card v-for="(item,index) in orderList" @click="toOderDetail(item.movieOrder.id)">
			<uni-row>
				<uni-col :offset="1" :span="3">
					<image src="../../../static/1-电影票.png" style="width: 80px;height: 80px;"></image>
				</uni-col>
				<uni-col :span="17">
					<p style="padding: 10px;">
						<span style="font-size: 30px;font-weight: bold; padding-right: 10px;">
							{{item.movieOrder.movieName}}
						</span>
						<span
							style="font-size: 20px;vertical-align: 5px;color: #ffaa00;">{{item.movieOrder.selectTable.length}}张</span>
					</p>
					<p style="padding: 10px;">
						<span style="font-size: 19px;">
							{{item.movieSession.startTime}}
						</span>
					</p>
				</uni-col>
				<uni-col :span="3">
					<div v-if="item.movieOrder.orderStatus==0">
						<uni-tag text="已完成" type="success"></uni-tag>
					</div>
					<div v-if="item.movieOrder.orderStatus==1">
						<uni-tag text="已取消" type="default"></uni-tag>
					</div>
				</uni-col>
			</uni-row>
		</uni-card>
	</div>
</template>

<script setup lang="ts">
	import {
		ref,
		onMounted
	} from 'vue'
	import api from '../../../api/api'
	import utils from '../../../utils'
	
	const userInfo = ref()
	const orderList = ref()
	onMounted(() => {
		uni.getStorage({
			key: 'userInfo',
			success: function(res) {
				userInfo.value = res.data
			}
		})
		getOrderList()
	})
	const getOrderList = () => {
		api.order.getMovieOrderByUserId({
			userId: userInfo.value.user.userId
		}).then(res => {
			if (res.data.code == 0) {
				orderList.value = res.data.data.list
				orderList.value.forEach(item => {
					item.movieOrder.selectTable = JSON.parse(item.movieOrder.selectTable)
				})
			}
		})
	}
	const toOderDetail=(id:any)=>{
		uni.navigateTo({
			url:'/pages/film/user/orderDetail?orderId='+id
		})
	}
</script>

<style>
</style>
